<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>账号管理 - 小憨堡</title>
        <script src="../static/js/jquery-3.2.1.js"></script>
        <link rel="stylesheet" href="../static/bootstrap-3.3.7-dist/css/bootstrap.css" />
        <link rel="stylesheet" href="../static/css/style.css" />
        <script>
            $(document).ready(function () {
                $.get(
                    "/currentUser",
                    function (data, status) {
                        if (data.code == 0) {
                            $("#top-nav").append("<li><a href=\"logout\" style='font-size: 12px;'>你好：" + data.data + " (退出登录)</a></li>\n" +
                                "                    <li><a href=\"account.html\">账号管理</a></li>\n" +
                                "                    <li><a href=\"address.html\">地址管理</a></li>" +
                                "                    <li><a href=\"index.html\">首页</a></li>\n"
                            );
                        } else {
                            $("#top-nav").append("<li><a href=\"login.html\">登录</a></li>");
                        }
                    }
                );
            });
            function changeUsername() {
                if (!confirm("用户名每30天只能更改一次，确认要修改吗？")) return;
                if ($("#username").val() == "") {
                    alert("请输入用户名");
                    return;
                }
                $.post(
                    "/user/username/update",{
                        username: $("#username").val()
                    },function (data, status) {
                        afterUserInfoSet(data);
                    }
                );
            }
            function changePhone() {
                if (!confirm("手机号每30天只能更改一次，确认要修改吗？")) return;
                if (!/^\d{11}$/.test($("#phone").val())) {
                    alert("不是有效的手机号！");
                    return;
                }
                $.post(
                    "/user/phone/update",{
                        phone: $("#phone").val()
                    },function (data, status) {
                        afterUserInfoSet(data);
                    }
                );
            }
            function changePassword() {
                if ($("#old-password").val() == "" || $("#new-password").val() == "") {
                    alert("密码不能为空");
                    return;
                }
                $.post(
                    "/user/password/update", {
                        oldPassword: $("#old-password").val(),
                        newPassword: $("#new-password").val()
                    },function (data, status) {
                        afterUserInfoSet(data);
                    }
                );
            }
            function afterUserInfoSet(data) {
                if (data.code == 0) {
                    alert("修改成功！");
                    window.location = "/account.html";
                } else {
                    alert("修改失败！原因：" + data.msg);
                }
            }
        </script>
    </head>
    <body>
    <div class="login-bg">
    </div>
    <div class="topbar">
        <img src="../static/images/index-logo.png" />
        <ul id="top-nav">

        </ul>
    </div>
    <div class="container">
        <div class="login-header">更改用户名</div>
        <div class="form-group">
            新用户名：<input type="text" id="username" class="form-control" />
        </div>
        <button class="btn btn-success form-control" onclick="changeUsername()">提交</button>
        <div class="login-header">更改手机号</div>
        <div class="form-group">
            新手机号：<input type="text" id="phone" class="form-control" />
        </div>
        <button class="btn btn-success form-control" onclick="changePhone()">提交</button>
        <div class="login-header">更改密码</div>
        <div class="form-group">
            旧密码：<input type="password" id="old-password" class="form-control" />
            新密码：<input type="password" id="new-password" class="form-control" />
        </div>
        <button class="btn btn-success form-control" onclick="changePassword()">提交</button>
        <div class="form-group"></div>
    </div>
    <div class="sidebar-footer">
        <p class="copyright">Copyright &copy; 2020. Group 6 All rights reserved.</p>
    </div>
    </body>
</html>